<template>
  <div>
    <div>{{orderNo}}</div>
    <button @click="pay">确认支付</button>
    <div v-html="alipay"></div>
    <div id="code">微信二维码</div>
  </div>
</template>
<script>
import QRCode from "qrcodejs2";
export default {
  name: "order-pay",
  data() {
    return {
      orderNo: 0,
      alipay: "",
    };
  },
  created() {
    this.goLogin();
    this.orderNo = this.$route.params.orderNo;
    this.getOrderDetail();
  },
  mounted() {
    const oScript = document.createElement("script");
    oScript.type = "text/javascript";
    oScript.src = "js/jquery.qrcode.min.js";
    document.body.appendChild(oScript);
  },
  methods: {
    pay() {
      const orderNo = this.orderNo;
      this.axios
        .post("/pay", {
          orderId: orderNo,
          orderName: "111",
          amount: "0.01",
          payType: 2,
        })
        .then((data) => {
          if (data.content.indexOf("weixin") >= 0) {
            const wx = data.content;
            new QRCode("code", {
              text: wx,
              width: 128,
              height: 128,
              colorDark: "#000000",
              colorLight: "#ffffff",
              correctLevel: QRCode.CorrectLevel.H,
            });
          } else {
            this.alipay = data.content;
            setTimeout(() => document.forms[0].submit(), 0); //跳转支付
          }
        });
    },
    goLogin() {
      this.axios.get("/user");
    },
    getOrderDetail() {
      const orderNo = this.orderNo;
      this.axios
        .get("/orders/" + orderNo)
        .then((data) => window.console.log(data));
    },
  },
};
</script>